import { lazy, Suspense } from 'react';

import PagePostHome from './post/home';
import PagePost from './p/:post-id';
import PageUserLogin from './user/login';
import PageUserRegister from './user/register';
import PageUserSummary from './user/summary';
import PageWorkspace from './workspace';

const PagePostEditor = lazy(() => import('./post/edtior'));
const PagePostUpdator = lazy(() => import('./post/edtior/:post-id'));

const routes = [
  { path: '/about', page: () => <About /> },
  { path: '/p/:postId', page: () => <PagePost /> },
  {
    path: '/post/editor/:postId',
    page: () => (
      <Suspense fallback="加载中">
        <PagePostUpdator />
      </Suspense>
    ),
  },
  {
    path: '/post/editor',
    page: () => (
      <Suspense fallback="加载中">
        <PagePostEditor />
      </Suspense>
    ),
  },
  { path: '/post/home', page: () => <PagePostHome /> },
  { path: '/user/login', page: () => <PageUserLogin /> },
  { path: '/user/register', page: () => <PageUserRegister /> },
  { path: '/user/summary', page: () => <PageUserSummary /> },
  { path: '/workspace', page: () => <PageWorkspace /> },
  { path: '/', page: () => <Home /> },
];

function Home() {
  return <h2>Home</h2>;
}

function About() {
  return <h2>About</h2>;
}

export default routes;
